<template>
  <div id="app" style="padding-left: 10%">
    <div class="head_box">
      <div id="head_wrap">

        <div id="head_right">
          <div id="head_landing">
            <el-dropdown>
              <el-button style="background-color: #333;border: #333">
                <span style="color: white">{{mname}}</span><i class="el-icon-arrow-down el-icon--right"></i>
              </el-button>
              <el-dropdown-menu slot="dropdown" style="width: 100px;text-align: center">
                <el-dropdown-item @click.native="stuinfo">个人信息</el-dropdown-item>
                <el-dropdown-item>账户管理</el-dropdown-item>
                <el-dropdown-item>退出登录</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </div>
          <div id="head_car" class="shopping-cart">
            <router-link to="/collect" class="head_car_text">收藏夹</router-link>
          </div>
        </div>
      </div>
    </div>
    <div id="main_head_box">
      <div id="menu_wrap">
        <div id="menu_logo">
        </div>
        <div id="menu_nav">
          <ul>
            <li style="color: #8c939d">热门职位:</li>
            <li v-for="(item,index) in topSecondLink" :key="index" class="menu_li"><span @click="hot(item.name)" >{{item.name}}</span></li>
          </ul>
        </div>
        <el-input v-model="name" placeholder="公司/岗位" style="width: 180px; margin-top: 28px"></el-input>

        <el-button type="primary" icon="el-icon-search" style="margin-left: 10px" @click="seach">搜索</el-button>
      </div>
    </div>
  <div>
    <div id="big_banner_wrap">
      <ul id="banner_menu_wrap">
        <li class="active" style="text-align: center">
          <a class="banner_menu_i" style="margin-left: -30px">技术 <i class="el-icon-caret-right"></i></a>
          <div class="banner_menu_content" style="width:990px;top:0">
            <dl class="detail_left ">
              <dt>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  后端开发
                </a>
              </dt>
              <dd>
                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    语音/视频/图形开发
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    后端开发
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    Perl
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    数据采集
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    全栈工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    C++
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    Python
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    Hadoop
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    Golang
                  </a>

                </p>
              </dd>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  移动开发
                </a>
              </dt>
              <dd>

                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    Android
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    U3D
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    HTML5
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    iOS
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    UE4
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    Flash开发
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    移动web前端
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    JavaScript
                  </a>
                </p>
              </dd>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  测试
                </a>
              </dt>
              <dd>

                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    自动化测试
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    游戏测试
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    移动端测试
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    软件测试
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    测试开发
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    渗透测试硬件测试
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    性能测试
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    测试工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    功能测试
                  </a>
                </p>
              </dd>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  运维/技术支持
                </a>
              </dt>
              <dd>

                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    DBA
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    系统工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    网络安全
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    网络工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    系统管理员运维开发工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    运维开发工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    IT技术支持
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    运维工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    系统安全
                  </a>
                </p>
              </dd>
              <br>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  硬件开发
                </a>
              </dt>
              <dd>

                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    DSP开发
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    硬件工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    自动化
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    射频工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    电路设计
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    PCB工艺FPGA开发
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    单片机
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    嵌入式
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    系统集成
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    ARM开发
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    驱动开发
                  </a>
                </p>
              </dd>
              <br>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  通信
                </a>
              </dt>
              <dd>
                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    光传输工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    核心网工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    通信测试工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    无线/射频通信工程师通信标准化工程师
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    有线传输工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    通信项目经理
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    光网络工程师电信交换工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    电信网络工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    通信研发工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    通信项目专员数据通信工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    光通信工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    通信电源工程师
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    通信设备工程师移动通信工程师
                  </a>
                </p>
              </dd>
            </dl>
          </div>
        </li>
        <li class="active" style="text-align: center">
          <a class="banner_menu_i" style="margin-left: -30px">产品 <i class="el-icon-caret-right"></i></a>
          <div class="banner_menu_content" style="width:990px;top:0">
            <dl class="detail_left ">
              <dt>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  产品经理
                </a>
              </dt>
              <dd>
                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    数据产品经理
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    产品经理
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    产品专员
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    产品助理网页产品经理
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    游戏策划
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    移动产品经理
                  </a>
                  <a href="#" target="_blank" style="color: #8c939d">
                    电商产品经理
                  </a>
                </p>
              </dd>
              <dt>
                <br>
                <a href="" target="_blank" style="color: #409EFF;font-weight: 700">
                  高端产品职位
                </a>
              </dt>
              <dd>

                <p>
                  <a href="" target="_blank" style="color: #8c939d">
                    产品总监
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    产品
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    游戏制作人
                  </a>

                  <a href="#" target="_blank" style="color: #8c939d">
                    高端产品职位
                  </a>
                </p>
              </dd>
            </dl>
          </div>
        </li>
      </ul>
<!--      论补图-->
      <div id="big_banner_pic_wrap">
        <el-carousel>
          <el-carousel-item v-for="(item,index) in imgs" :key="index">
            <img :src="item">
          </el-carousel-item>
        </el-carousel>
      </div>
    </div>

    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="IT互联网" name="IT互联网">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="金融" name="金融">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="房地产" name="房地产">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="教育培训" name="教育培训">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="娱乐传媒" name="娱乐传媒">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="医疗健康" name="医疗健康">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="法律咨询" name="法律咨询">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="供应链" name="供应链">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
      <el-tab-pane label="采购贸易" name="采购贸易">
        <div>
          <ul>
            <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
              <div class="sub-li" style="position:relative;">
                <a href="#" class="job-info" style="text-decoration:none">
                  <div class="sub-li-top" style="margin-top: 0px">
                    <p class="gname">{{item.enterInfo.cname}}</p>
                    <p class="salary">{{item.salary}}</p>
                  </div>
                  <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
                </a>
                <div class="sub-li-bottom">
                  <a href="#" class="user-info" style="text-decoration:none">
                    <p><img :src="qz+item.enterInfo.logoimg"></p>
                  </a>
                  <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                    <span >{{item.gname}}</span>
                    <span class="vline">
                    </span>
                    <span >{{item.gw}}</span>
                  </a>
                </div>
              </div>
            </li>
          </ul>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
    <br><br><br><br>
  </div>
</template>
<script src="../../../assets/js/test.js"></script>
<script>

import "../../../assets/js/test.js"
//菜单栏的显示
import "../../../assets/js/sort"
import img1 from "../../../assets/studentimgs/1.jpg"
import img2 from "../../../assets/studentimgs/2.jpg"
import img3 from "../../../assets/studentimgs/3.jpg"
import img5 from "../../../assets/studentimgs/5.jpg"


export default {
  name: "index",
  data(){

    const topSecondLink = [
      {name: "Java"},
      {name: "产品经理"},
      {name: "Web前端"},
      {name: "运维工程师"},
      {name: "项目经理"},
      {name: "测试工程师"},
      {name: "电商运营"},
      {name: "UI设计师"},
      {name: "平面设计"},
    ]
    return{
      mname:sessionStorage.getItem("studentname"),
      activeName: 'IT互联网',
      imgs:[img1,img2,img3,img5],
      topSecondLink,
      isLogin:false,
      nickname:"",
      shopNum:0,
      shops:null,
      totalMoney:0,
      key:"",
      sideLink: null,
      qz:this.$axios.defaults.baseURL,
      minute:60,
      second:0,
      enterinfo:[],
      name:'',
    }
 },

  mounted() {
    this.selectinfo("IT互联网",this.name);
  },
  methods:{
    hot(_name){
      console.log(_name);
      this.name = _name;
      this.seach();
    },
    stuinfo(){
      this.$router.push("/home");
    },
    handleClick(tab, event) {
      this.selectinfo(tab.name,this.name);
    },
    seach(){
      this.selectinfo("IT互联网",this.name);
    },
    selectinfo(_type,_keyword){
      //发送请求
      this.$axios({
        url: this.$axios.defaults.baseURL+"/student/main",
        method: "get",
        params:{
          type : _type,
          keyword:_keyword
        }
      }).then(res => {
        this.enterinfo = res.data;
      })
    },
    eninfo(wid,tid,uid){
      sessionStorage.setItem("tuid",uid)
      this.$router.push({path: '/enterinfo', query: {wid: wid,tid:tid,type:"maininfo"}})
    }

  }
}
</script>

<style>
.vline {
  display:inline-block;
  width:1px;
  height:12px;
  vertical-align:middle;
  background:#8c939d;
  margin:0 10px
}
.el-carousel__container{
  height: 460px!important;
}
</style>

<style src="../../../assets/css/xiaomi.css" scoped />

<style>
body{
  margin: 0;
  background-color: #f2f6fc;
}
</style>
<style scoped>

.head_box #head_wrap #head_right #head_car:hover #car_content{
  display: block;
}
.head_box #head_wrap #head_right #head_car:hover{
  background: #ffffff;
}
.head_box #head_wrap #head_right #head_car:hover a{
  color: #FF6700!important;
}

.user-menu li{
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.user-menu a{
  color:#b0b0b0;
}
.user-menu li:hover{
  background: #f5f5f5;
}
.user-menu li:hover a{
  color: #FF6700!important;
}
.login-name:hover .login-nickname{
  color: #FF6700;
  background: #fff;
}
.login-name:hover .user-menu-wrapper{
  display: block;
}

.site-topbar .user-menu a {
  display: block;
  padding: 3px 30px;
  line-height: 2;
}
.site-topbar a {
  color: #b0b0b0;
  line-height: 40px;
  display: inline-block;
}

a.head_car_text {
  color: #ffffff;
}

.list-service li:first-child {
  border-left: 0;
}
.list-service li {
  float: left;
  width: 19.8%;
  height: 25px;
  border-left: 1px solid #e0e0e0;
  font-size: 16px;
  line-height: 25px;
  text-align: center;
}
.list-service a {
  color: #616161;
  -webkit-transition: color .2s;
  transition: color .2s;
  display: flex;
  justify-content: center;
  align-items: center;
}
.list-service a:hover{
  color: #FF6700;
  text-decoration: none;
}
li.menu_li a {
  color: #333;
}
li.menu_li a:hover{
  color: #FF6700;
  text-decoration: none;
}
.home-main {
  padding-top: 4px;
  padding-bottom: 12px;
  margin-top: 30px;
}
.page-main {
  background: #f5f5f5;
}
.container {
  width: 1226px;
  margin-right: auto;
  margin-left: auto;
}
/*小米闪购*/
.home-flashsale {
  margin-bottom: 22px;
  position: relative;
}
.xm-plain-box .box-hd {
  position: relative;
  height: 58px;
  -webkit-font-smoothing: antialiased;
}
.xm-plain-box .box-hd .title {
  margin: 0;
  font-size: 22px;
  font-weight: 200;
  line-height: 58px;
  color: #333;
}
.row {
  margin-left: -14px;
  display: flex;
}
.home-flashsale .rainbow-item-4 {
  border-top-color: #e53935;
}

.home-flashsale .flashsale-countdown {
  height: 300px;
  padding-top: 39px;
  border-top-width: 1px;
  border-top-style: solid;
  background: #f1eded;
  text-align: center;
}
.span4 {
  width: 234px;
}
.home-flashsale .flashsale-countdown .round {
  font-size: 21px;
  color: #ef3a3b;
  padding-top: 15px;
}
.home-flashsale .flashsale-countdown img {
  margin: 25px auto;
}
.home-flashsale .flashsale-countdown .desc {
  color: rgba(0,0,0,.54);
  font-size: 15px;
}
.home-flashsale .flashsale-countdown .countdown {
  width: 168px;
  margin: 28px auto 0;
}
.home-flashsale .flashsale-countdown .countdown span {
  width: 46px;
  height: 46px;
  background: #605751;
  color: #fff;
  font-size: 24px;
  line-height: 46px;
  float: left;
}
.home-flashsale .flashsale-countdown .countdown i {
  width: 15px;
  float: left;
  height: 46px;
  line-height: 46px;
  color: #605751;
  font-size: 28px;
  font-style: normal;
}
.home-flashsale .flashsale-list {
  float: left;
}
.span16 {
  width: 978px;
}
.swiper-container {
  margin: 0 auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 1;
}
.home-flashsale .flashsale-list ul {
  margin: 0;
  padding: 0;
  height: 340px;
  display: flex;
}
.home-flashsale .flashsale-list li {
  width: 234px;
  margin-right: 14px;
  border-top-width: 1px;
  border-top-style: solid;
  text-align: center;
  background: #fff;
  -webkit-transition: all .6s;
  transition: all .6s;
  position: relative;
  list-style: none;
}
.home-flashsale .flashsale-list li a {
  display: block;
  height: 300px;
  padding-top: 39px;
  position: relative;
}
.home-flashsale .flashsale-list .thumb {
  display: block;
  width: 160px;
  margin: 0 auto 22px;
}
.home-flashsale .flashsale-list .thumb img {
  width: 160px;
  height: 160px;
}
.home-flashsale .flashsale-list .title {
  margin: 0 20px 3px;
  font-size: 14px;
  font-weight: 400;
  text-overflow: ellipsis;
  color: #212121;
  overflow: hidden;
  white-space: nowrap;
}
.home-flashsale .flashsale-list .desc {
  height: 18px;
  margin: 0 20px 12px;
  font-size: 12px;
  text-overflow: ellipsis;
  color: #b0b0b0;
  overflow: hidden;
  white-space: nowrap;
}
.home-flashsale .flashsale-list .price {
  margin: 0;
  color: #ff6709;
}
.home-flashsale .flashsale-list .price del {
  color: #b0b0b0;
}
.swiper-container .swiper-notification {
  position: absolute;
  left: 0;
  top: 0;
  pointer-events: none;
  opacity: 0;
  z-index: -1000;
}
.home-flashsale .swiper-controls {
  position: absolute;
  right: 0;
  top: 24px;
}
.home-flashsale .swiper-flashsale-next, .home-flashsale .swiper-flashsale-prev {
  display: inline-block;
  width: 24px;
  height: 16px;
  padding: 3px 5px;
  margin-left: -1px;
  border: 1px solid #e0e0e0;
  font-size: 16px;
  line-height: 16px;
  -webkit-transition: color .5s;
  transition: color .5s;
  color: #b0b0b0;
  text-align: center;
  cursor: pointer;
}
.home-flashsale .swiper-flashsale-prev.swiper-button-disabled {
  color: #e0e0e0;
  cursor: default;
}

.home-flashsale .flashsale-list li a:hover{
  text-decoration: none;
}

/*其他内容*/

.function-img {
  width: 24px;
  height: 24px;
  margin-top: 15px;
}
p.function-text {
  color: #ffff;
}
.head_other_ad img {
  display: block;
  width: 316px;
  height: 170px;
}


.list{
  list-style-type:none;
  float: left;
  padding-right: 20px;
  padding-top: 20px;
}

.sub-li .sub-li-top {
  width:340px;
  display:flex;
  align-items:center
}
.sub-li .sub-li-top {
  position:relative;
  max-width:200px;
  font-size:15px;
  margin-right:8px;
  line-height:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-top{
  font-size:15px;
  color:#fd7240;
  line-height:normal;
  flex:1;
  text-align:right;
  max-width:none
}

.salary {
  font-size:15px;
  color:#fd7240;
  margin-top: 0px;
  padding-left: 17%;
}

.gname {
  font-size:15px;
  color:black;
  margin-top: 0px;
  margin-left:0px;
}
.sub-li a.job-info {
  padding:0;
  width:340px;
}
.sub-li-bottom a.user-info {
  margin:0
}
.sub-li-bottom .user-info img {
  width:30px;
  height:30px
}
.job-text{
  font-size: 14px;
  color: #8c939d;
}
.sub-li .sub-li-bottom {
  border-top:1px solid #eef0f5;
  display:flex;
  margin-top:8px;
  padding-top:12px
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info {
  font-size:13px;
  color:#8d92a1;
  display:flex;
  align-items:center;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info .name {
  margin-left:10px;
  margin-right:20px;
  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info .type {
  max-width:90px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info{
  max-width:80px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li {
  width:340px;
  height:100%;
  position:relative;
  padding:20px 20px 0 20px;
  box-sizing:border-box;
  border-radius:5px;
  background-color: white;
}

</style>
